<!DOCTYPE html>
<html>
	<head>
			<meta charset="utf-8">
			<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
			<title></title>
			<link rel="stylesheet" href="css/index.css">
			<link rel="stylesheet" href="css/common.css">
			<link rel="stylesheet" href="css/iconfont.css">
			<link rel="stylesheet" href="css/mui.css">
			<link rel="stylesheet" href="css/normalize.css">
	</head>
	
	<body>
		<div class="container">
			<header>
				<h1>垃圾分类</h1>
				<ul>
					<li>
						<i class="iconfont icon-huishouzhan"></i>
						<span>回收站</span>
					</li>
					<li>
						<i class="iconfont icon-lajizhan-s"></i>
						<span>垃圾站</span>
					</li>
					<li>
						<i class="iconfont icon-leimupinleifenleileibie"></i>
						<span>垃圾分类</span>
					</li>
				</ul>
			</header>
			<footer>
				<i class="iconfont icon-yuyin" id = "yuYin"></i>
				<ul>
					<li>
						<i class="iconfont icon-about"></i>
						<span>语音查找</span>
						<div id = "goSearch">
							<i class="iconfont icon-fangdajing" ></i>
						</div>
					</li>
				</ul>
			</footer>
		</div>
	</body>
	
	<script src='js/flexible.js'></script>
	<script src="js/mui.min.js"></script>
	<script src='js/iconfont.js'></script>
	<script type="text/javascript" charset="utf-8">
	mui.init();
	mui.plusReady(function () {
		/* 点击搜索图标跳转到搜索界面 */
		mui("#goSearch").on('tap','i',function(){
			mui.openWindow('search.html');
		})
		
		//设置状态栏颜色
	    plus.navigator.setStatusBarBackground('#F2F2F0');
		//触发语音识别
		mui('footer').on('tap','#yuYin',function(){
			//执行语音识别
			fStartRecognize();
		})
		//封装语音识别函数
		function fStartRecognize(){
			var options = {
				engine:'iFly',
				punctuation:false
			}
			
			/* plus.speech.startRecognize ()函数包含3个参数，options是一个对象，里面包括要设置的参数*/
			plus.speech.startRecognize( options, function(data){
				mui.openWindow({
					url:'detail.html',
					id:'detail',
					extras:{
						title:encodeURI(data)
					},
					show:{
					    autoShow:true
					},
					waiting:{
						autoShow:true,
						title:'正在加载...'
					}
				})
			}, function(){
				mui.toast('语音识别失败',{ duration:'long', type:'div' })
			});
			setTimeout(fStopRecognize,10000);
		}
		//停止语音识别
		function fStopRecognize(){
			plus.speech.stopRecognize();
		}
		/* 点击垃圾分类跳转 */
		mui("header ul").on('tap','li',function(){
			mui.openWindow({
				url:'class.html',
				id:'class',
				show:{
					aotuShow:true
				},
				waiting:{
					aotuShow:true,
					title:"正在加载中..."
				}
			})
		})
		
	})
	</script>
</html>